import { DingdingOutlined } from '@ant-design/icons';
import { Button, Card, Steps, Result, Descriptions } from 'antd';
import { Fragment } from 'react';
import { GridContent } from '@ant-design/pro-layout';

import styles from './index.less';

const { Step } = Steps;
const userName = localStorage.getItem("userName")
const userAccount = localStorage.getItem("userAccount")


const content = (
  <>
    <Descriptions title="新生入学进度">
      <Descriptions.Item label="学号">{userAccount}</Descriptions.Item>
      <Descriptions.Item label="姓名">{userName}</Descriptions.Item>
      <Descriptions.Item label="入学时间">2023年9月</Descriptions.Item>
    </Descriptions>
    <br />
    <Steps progressDot current={1}>
      <Step title={<span style={{ fontSize: 14 }}>录取</span>} />
      <Step title={<span style={{ fontSize: 14 }}>夏令营</span>} />
      <Step title={<span style={{ fontSize: 14 }}>新生入学报到</span>} />
      <Step title={<span style={{ fontSize: 14 }}>成为河工大小人！！！</span>} />
    </Steps>
  </>
);

const extra = (
  <Fragment>
    <Button type="primary">返回主页</Button>
    <Button>个人信息</Button>
  </Fragment>
);

export default () => (
  <GridContent>
    <Card bordered={false}>
      <Result
        status="error"
        title="访问受限"
        subTitle="此功能区需要”新生入学报到“之后才能开放！"
        extra={extra}
        style={{ marginBottom: 16 }}
      >
        {content}
      </Result>
    </Card>
  </GridContent>
);
